/* ============================================
   VARIABLES GLOBALES DEL SITIO
   Psicología de la Religión
   Extraídas del index.html (página de inicio)
   ============================================ */

:root {
  /* === Colores Principales (Elementor Global) === */
  --color-primary: #3DBD51;
  --color-secondary: #2E7EDE;
  --color-text: #7A7A7A;
  --color-accent: #175F6A;
  --color-accent-dark: #8C1F1F;

  /* === Colores del Tema === */
  --color-nav-bg: #426e86;
  --color-nav-bg-alpha: rgba(66, 110, 134, 0.52);
  --color-secondary-btn: #90AFC5;
  --color-footer-bg: #4aa5a4;
  --color-footer-text: #61C0BF;
  --color-header-banner-bg: #b0d9c8;
  --color-body-bg: #ffffff;
  --color-site-title: #426e86;
  --color-newsment-accent: #12A86B;
  --color-newsment-secondary: #FF8C02;
  --color-newsment-tertiary: #ED2938;
  --color-top-masthead: #000000;

  /* === Colores del Footer Profesional === */
  --footer-bg-start: #1a3a4a;
  --footer-bg-mid: #2a5a6a;
  --footer-bg-end: #1e4d5e;
  --footer-text: #c8dfe6;
  --footer-link: #8ec8d8;
  --footer-brand-desc: #9ab8c4;
  --footer-copyright: #7a9eab;
  --footer-copyright-strong: #a0c8d4;
  --footer-border-accent: rgba(61, 189, 81, 0.4);

  /* === Tipografía === */
  --font-primary: "Roboto", sans-serif;
  --font-secondary: "Roboto Slab", "Georgia", serif;
  --font-text: "Roboto", sans-serif;
  --font-accent: "Roboto", sans-serif;
  --font-heading-special: "Zen Old Mincho", sans-serif;
  --font-body: "Source Sans Pro", sans-serif;
  --font-nav: Verdana, Geneva, sans-serif;

  /* === Pesos Tipográficos === */
  --fw-primary: 600;
  --fw-secondary: 400;
  --fw-text: 400;
  --fw-accent: 500;

  /* === Tamaños de Fuente (WordPress) === */
  --fs-small: 13px;
  --fs-medium: 20px;
  --fs-large: 36px;
  --fs-x-large: 42px;

  /* === Espaciado (WordPress) === */
  --spacing-20: 0.44rem;
  --spacing-30: 0.67rem;
  --spacing-40: 1rem;
  --spacing-50: 1.5rem;
  --spacing-60: 2.25rem;
  --spacing-70: 3.38rem;
  --spacing-80: 5.06rem;

  /* === Sombras (WordPress) === */
  --shadow-natural: 6px 6px 9px rgba(0, 0, 0, 0.2);
  --shadow-deep: 12px 12px 50px rgba(0, 0, 0, 0.4);
  --shadow-sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);

  /* === Breakpoints de Referencia === */
  /* mobile: 767px max */
  /* mobile_extra: 880px max */
  /* tablet: 1024px max */
  /* tablet_extra: 1200px max */
  /* widescreen: 2400px min */
}